<template>
    <div class="Room" id="Room" style="width:100%" >
        <!-- 房间列表 -->
        <div class="RoomTop">
            <p :class="k==num?'in':''" v-for="(tiem,k) in init.Room.sonRooom" @click="tabRoomTable(k)">{{k}}</p>
        </div>
        <div class="center" style="width:100%" >
            <div class="table" id="table">
                <li v-for="sonTemi in init.Room.sonRooom[num]">
                    <p class="left" @mouseover="samllShow=sonTemi.id" @mouseout="samllShow=false">B{{sonTemi.id}}</p>
                    <p class="right">
                        <span>{{sonTemi.time}}s</span>
                        <span :class={dt:star}></span>
                    </p>
                </li>						
            </div>
            <div class="sollcp">
                <a href="javascript:;" style="background: url(../../../../static/img/bottomTable.png) no-repeat;background-size: 100% 100%" @mouseup="clearSet"  @mousedown="topRoom"></a>
                <a href="javascript:;" style="background: url(../../../../static/img/topTable.png) no-repeat;background-size: 100% 100%" @mouseup="clearSet" @mousedown="bottomRoom"></a>
            </div>
        </div>
        <Smalls></Smalls>
        <transition enter-active-class="animated fadeIn" >
            <div class="Small" v-show="samllShow"><h2>B{{samllShow}}</h2></div>	
        </transition>
    </div>	 
</template>
<script>
import Smalls from "@/components/gameCenter/srokerBox/samll.vue"

export default {
    name:"room",
    components:{
         Smalls
    },
    data(){
        return {
             // 初始化数据
        init: {
            personal: {
                name: "DDD1号",
                money: 12000
            },
            Room: {
                nember: "百家乐A1",
                gameNum: "GCS15200",
                gameRedTop: "20-6000",
                personalRedTop: "500",
                personalDownMoney: 0,
                onLine: 988,
                z: 0,
                h: 0,
                he: 0,
                z2: 0,
                h2: 0,
                videoBox: {
                    one: true,
                    two: true
                },
                Player: {},
                sonRooom: {
                    "迪威一厅": [
                        { id: 1, time: 30 },
                        { id: 2, time: 45 },
                        { id: 3, time: 25 },
                        { id: 4, time: 18 },
                        { id: 5, time: 50 },
                        { id: 6, time: 30 },
                        { id: 7, time: 30 },
                        { id: 8, time: 30 },
                        { id: 9, time: 12 },
                        { id: 10, time: 50 },
                        { id: 11, time: 55 },
                        { id: 12, time: 60 },
                        { id: 13, time: 9 },
                        { id: 14, time: 12 },
                        { id: 15, time: 17 },
                        { id: 16, time: 60 },
                        { id: 17, time: 5 },
                        { id: 18, time: 19 },
                        { id: 19, time: 48 },
                        { id: 20, time: 30 },
                        { id: 21, time: 30 },
                        { id: 22, time: 60 },
                        { id: 23, time: 52 },
                        { id: 24, time: 48 },
                        { id: 25, time: 37 },
                        { id: 26, time: 34 },
                        { id: 27, time: 46 },
                        { id: 28, time: 50 },
                        { id: 29, time: 52 },
                        { id: 30, time: 51 },
                    ],
                    "迪威二厅": [
                        { id: 1, time: 30 },
                        { id: 2, time: 45 },
                        { id: 3, time: 25 },
                        { id: 4, time: 18 },
                        { id: 5, time: 50 },
                        { id: 6, time: 30 },
                        { id: 7, time: 30 },
                        { id: 8, time: 30 },
                        { id: 9, time: 12 },
                    ]
                }
            }
        },
        //  房间列表
        num: "迪威一厅",
        star: false,
        samllShow: null,
        }
    },
    methods:{
         // 切换房间列表
        tabRoomTable: function (x) {
            this.num = x;
        },
         clearSet: function () {
            clearInterval(set);
        },
        topRoom: function () {
        var a = document.getElementById("table");
        set = setInterval(function () {
            a.scrollTop--;
            if (a.scrollTop <= 0) {
                clearInterval(set);
            }
        });
    },
        bottomRoom : function () {
                var a = document.getElementById("table");
                var b = a.scrollHeight - a.clientHeight;
                set = setInterval(function () {
                    a.scrollTop++;
                    if (a.scrollTop >= b) {
                        clearInterval(set);
                    }
                });
            },
    },
      mounted(){
              // 倒数定时器
          var _this = this;     
         setInterval(function () {
            var i;
            _this.time--;
            if (_this.time < 0) {
                _this.time = 60;
            }
            else if (_this.time < 54) {
                _this.cardResult = "";
            }
            _this.star = true;
            for (i in _this.init.Room.sonRooom) {
                _this.init.Room.sonRooom[i].forEach(function (state) {
                    if (state.time == 0) {
                        state.time = 60;
                    }
                    else {
                        state.time--;
                    }
                });
            }
        }, 1000);
    }
}
</script>
<style scoped>
    
</style>


